import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';

import 'index.dart';
import 'widgets/comment/comment_tab.dart';
import 'widgets/activity/activity_tab.dart';
import 'widgets/publish/my_publish_tab.dart';

class PlaysPage extends GetView<PlaysController> {
  const PlaysPage({super.key});

  // 构建标签栏 - 使用原生TabBar
  Widget _buildTabBar() {
    return Obx(() {
      // 根据当前选中的标签索引决定文字颜色和背景色
      final int currentIndex = controller.currentTabIndex.value;

      // 评论页面和活动页面使用黑色文字，我的发布页面使用白色文字
      final bool useBlackText = currentIndex == 0 || currentIndex == 1;
      
      // 评论页面和活动页面使用浅灰色背景
      final Color backgroundColor = useBlackText 
          ? const Color(0xFFF5F5F5) // 浅灰色背景
          : Colors.transparent;

      return Container(
        // 完全移除外边距
        margin: EdgeInsets.zero,
        width: double.infinity,
        // 背景设为透明，让AppBar的背景色透出
        decoration: const BoxDecoration(
          color: Colors.transparent,
        ),
        child: TabBar(
          controller: controller.tabController,
          padding: EdgeInsets.zero, // 移除内边距
          indicator: UnderlineTabIndicator(
            borderSide: BorderSide(
              color: const Color(0xFFE33641).withValues(alpha: 0.75),
              width: 3,
            ),
            insets: const EdgeInsets.symmetric(horizontal: 20),
          ),
          // 根据页面动态设置颜色
          labelColor: useBlackText ? Colors.black : Colors.white,
          unselectedLabelColor: useBlackText
              ? Colors.black.withOpacity(0.7)
              : Colors.white.withOpacity(0.7),
          labelStyle: const TextStyle(
            fontSize: 16,
            fontWeight: FontWeight.w700,
          ),
          unselectedLabelStyle: const TextStyle(
            fontSize: 16,
            fontWeight: FontWeight.normal,
          ),
          dividerColor: Colors.transparent,
          indicatorSize: TabBarIndicatorSize.label,
          // 设置居中显示
          labelPadding: const EdgeInsets.symmetric(horizontal: 16),
          isScrollable: true,
          tabAlignment: TabAlignment.center, // Flutter 3.x新增属性，使标签居中对齐
          overlayColor: WidgetStateProperty.all(
            Colors.transparent,
          ), // 点击时的水波纹颜色设为透明
          tabs: controller.tabNames.map((name) => Tab(text: name)).toList(),
          // 添加点击事件，同步PageView
          onTap: (index) {
            controller.changeTab(index);
          },
        ),
      );
    });
  }

  // 构建标签页内容 - 使用PageView实现原生左右切换效果
  Widget _buildTabContent() {
    return PageView(
      controller: controller.pageController,
      // 禁止手动左右滑动
      physics: const NeverScrollableScrollPhysics(),
      onPageChanged: (index) {
        controller.currentTabIndex.value = index;
      },
      children: const [CommentTab(), ActivityTab(), MyPublishTab()],
    );
  }

  // 主视图 - 简化结构，不再使用Stack和Positioned
  Widget _buildView() {
    return _buildTabContent();
  }

  @override
  Widget build(BuildContext context) {
    // 我们现在使用AppBar的systemOverlayStyle属性设置状态栏，不再需要这里的代码
    // 移除直接调用SystemChrome.setSystemUIOverlayStyle的方式
    
    // 使用Obx监听当前标签索引变化，动态设置状态栏样式
    return Obx(() {
      // 根据当前选中的标签索引决定状态栏图标颜色
      final int currentIndex = controller.currentTabIndex.value;

      // 评论页面和活动页面使用深色图标（黑色），我的发布页面使用浅色图标（白色）
      final bool useDarkIcons = currentIndex == 0 || currentIndex == 1;

      // 不再在这里动态修改状态栏样式，现在通过AppBar的systemOverlayStyle属性控制
      // 如果需要根据当前标签切换不同的状态栏样式，可以使用动态AppBar

      return GetBuilder<PlaysController>(
        init: PlaysController(),
        id: "plays",
        builder: (_) {
          // 获取当前标签索引
          final int currentIndex = controller.currentTabIndex.value;
          final bool isMyPublishTab = currentIndex == 2; // 第三个标签是"我的发布"
          
          return Scaffold(
            extendBodyBehindAppBar: true, // 需要内容延伸到AppBar区域
            appBar: AppBar(
              toolbarHeight: 58, // 设置合适的高度
              backgroundColor: isMyPublishTab ? Colors.transparent : 
                (currentIndex == 0 || currentIndex == 1) ? const Color(0xFFF5F5F5) : Colors.blue, // 根据标签设置背景色
              elevation: 0,
              automaticallyImplyLeading: false, // 不显示返回按钮
              titleSpacing: 0, // 移除标题的水平内边距
              title: _buildTabBar(), // 直接将TabBar作为标题
              centerTitle: true, // 确保标题居中
              systemOverlayStyle: SystemUiOverlayStyle(
                statusBarColor: isMyPublishTab ? Colors.transparent : 
                  (currentIndex == 0 || currentIndex == 1) ? const Color(0xFFF5F5F5) : Colors.blue, // 根据标签设置状态栏背景色
                statusBarIconBrightness: (currentIndex == 0 || currentIndex == 1) ? Brightness.dark : Brightness.light, // 根据背景色设置图标颜色
                statusBarBrightness: (currentIndex == 0 || currentIndex == 1) ? Brightness.light : Brightness.dark, // iOS设置
              ),
            ),
            body: SafeArea(
              top: false, // 不为顶部留出安全区域，允许内容延伸到状态栏
              child: _buildView(),
            ),
          );
        },
      );
    });
  }
}
